<template>
  <div class="app-container">
    <div class="components-container">
      <el-form
        ref="lawsuit_form"
        :rules="lawsuitFormRules"
        :model="lawsuit_form"
        label-width="120px"
        label-position="right"
      >
        <fieldset>
          <legend>基本信息</legend>
          <el-row>
            <el-col :span="6">
              <el-form-item label="客户名称：" prop="customer_name">
                <el-select
                  v-model="lawsuit_form.customer_name"
                  filterable
                  :disabled="this.isEdit"
                  placeholder="请选择客户"
                  @change="setCustomerId"
                >
                  <el-option
                    v-for="item in customer_options"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value"
                  />
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="6">
              <el-form-item label="客户诉讼地位：" prop="case_litigation_status">
                <el-select v-model="lawsuit_form.case_litigation_status" filterable clearable placeholder="请选择客户诉讼地位">
                  <el-option
                    v-for="item in option_case_litigation_status"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value"
                  />
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="6">
              <el-form-item label="罪名：" prop="accusal_name">
                <el-select v-model="lawsuit_form.accusal_name" filterable clearable placeholder="请选择">
                  <el-option
                    v-for="item in option_case_accusal_name"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value"
                  />
                </el-select>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="6">
              <el-form-item label="案件编号：" prop="case_code">
                <el-input
                  v-model="lawsuit_form.case_code"
                  placeholder="自动生成"
                  maxlength="20"
                  show-word-limit
                  disabled
                />
              </el-form-item>
            </el-col>
            <el-col :span="6">
              <el-form-item label="案件类型：" prop="case_type">
                <el-select v-model="lawsuit_form.case_type" filterable clearable placeholder="请选择">
                  <el-option
                    v-for="item in option_case_type"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value"
                  />
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="6">
              <el-form-item label="案件阶段：" prop="case_step">
                <el-select v-model="lawsuit_form.case_step" filterable clearable placeholder="请选择">
                  <el-option
                    v-for="item in option_case_step"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value"
                  />
                </el-select>

              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="6">
              <el-form-item label="案件名称：" prop="case_name">
                <el-input
                  v-model="lawsuit_form.case_name"
                  placeholder="类似商标名称等信息"
                  maxlength="100"
                  show-word-limit
                />
              </el-form-item>
            </el-col>
            <el-col :span="6">
              <el-form-item label="申请日：" prop="case_created_date">
                <el-date-picker
                  v-model="lawsuit_form.case_created_date"
                  type="date"
                  format="yyyy-MM-dd"
                  placeholder="选择签订时间"
                  value-format="timestamp"
                />
              </el-form-item>
            </el-col>
          </el-row>
        </fieldset>
        <el-row style="text-align: right;">
          <el-button type="primary" size="small" @click="submitCustomerForm('lawsuit_form')">保存</el-button>
        </el-row>
      </el-form>
    </div>
    <div>
      <el-tabs type="border-card" @tab-click="tabsHandleClick">
        <el-tab-pane label="文档信息">
          <el-row style="text-align: left;padding: 5px 5px;">
            <el-button type="primary" size="mini" round @click="openCaseDialog(1)">新建</el-button>
          </el-row>
          <el-table :data="docTableData" height="250" style="width: 100%;">
            <el-table-column type="index" :index="computeTableIndex" label="序号" />
            <el-table-column prop="doc_name" label="文档名称" />
            <!--<el-table-column prop="doc_type" label="文档类型"/>-->
            <el-table-column prop="doc_create_date" label="文档日期">
              <template slot-scope="scope">
                <span>{{ scope.row.doc_create_date | formatSQLDateFormatYMD }}</span>
              </template>
            </el-table-column>
            <el-table-column label="操作">
              <template slot-scope="scope">
                <a :href="VUE_APP_BASE_API + '?fileId=' + scope.row.file_id" target="_blank">
                  <span>查看</span>
                </a>
              </template>
            </el-table-column>
          </el-table>
          <el-dialog
            title="案件文档"
            :visible.sync="dialogCaseDocFormVisible"
            :close-on-click-modal="false"
            :close-on-press-escape="false"
            :destroy-on-close="true"
            :append-to-body="true"
            @close="dialogCaseDocFormVisible=false"
          >
            <el-card class="box-card">
              <el-upload
                ref="upload"
                action
                accept=".pdf, .doc, .docx, .xls, .xlsx,.png,.jpg"
                style="display:inline-block"
                :limit="1"
                :file-list="docList"
                :http-request="uploadImg"
                :auto-upload="false"
              >
                <el-button slot="trigger" size="small" type="primary" plain>选取文件</el-button>
                <el-button
                  style="margin-left: 10px;"
                  size="small"
                  icon="el-icon-upload2"
                  type="success"
                  @click="submitUpload"
                >导入
                </el-button>
              </el-upload>
            </el-card>
          </el-dialog>
        </el-tab-pane>
        <el-tab-pane label="费用明细">
          <el-row style="text-align: left;padding: 5px 5px;">
            <el-button type="primary" size="mini" round @click="openCaseDialog(2)">新建</el-button>
          </el-row>
          <el-table :data="costTableData" height="250" style="width: 100%;">
            <el-table-column type="index" :index="computeTableIndex" label="序号" />
            <el-table-column align="center" label="费用类型">
              <template slot-scope="scope">
                <span>{{ scope.row.cost_type | formatCaseCostType }}</span>
              </template>
            </el-table-column>
            <el-table-column prop="cost_amount" label="金额" />
            <el-table-column prop="cost_remark" label="备注" />
            <el-table-column label="操作">
              <template slot-scope="scope">
                <a :href="VUE_APP_BASE_API + '?fileId=' + scope.row.file_id" target="_blank">
                  <span>查看</span>
                </a>
              </template>
            </el-table-column>
          </el-table>
          <el-dialog
            title="费用明细"
            :visible.sync="dialogCaseCostFormVisible"
            :close-on-click-modal="false"
            :close-on-press-escape="false"
            :destroy-on-close="true"
            :append-to-body="true"
            @close="dialogCaseCostFormVisible=false"
          >
            <el-card class="box-card">
              <el-form :model="CaseCostForm">
                <el-form-item label="费用类型：" prop="cost_type">
                  <el-select v-model="CaseCostForm.cost_type" filterable clearable placeholder="请选择">
                    <el-option
                      v-for="item in option_case_cost_type"
                      :key="item.value"
                      :label="item.label"
                      :value="item.value"
                    />
                  </el-select>
                </el-form-item>
                <el-form-item label="费用金额：">
                  <el-input v-model="CaseCostForm.cost_amount" type="number" style="width: 80%" />
                </el-form-item>
                <el-form-item label="费用备注：">
                  <el-input v-model="CaseCostForm.cost_remark" type="textarea" resize="none" style="width: 80%" />
                </el-form-item>
                <el-form-item style="text-align: right;">
                  <el-button type="primary" @click="saveCaseCost">保存</el-button>
                </el-form-item>
              </el-form>
            </el-card>
          </el-dialog>
        </el-tab-pane>
        <el-tab-pane label="系统日志">
          <el-row style="text-align: left;padding: 5px 5px;">
            <el-button type="primary" size="mini" round @click="openCaseDialog(3)">新建</el-button>
          </el-row>
          <el-table :data="caseLogTableData" height="250" style="width: 100%;">
            <el-table-column type="index" :index="computeTableIndex" label="序号" />
            <el-table-column prop="log_content" label="操作内容" />
            <el-table-column prop="log_date" label="操作日期">
              <template slot-scope="scope">
                <span>{{ scope.row.log_date | formatSQLDateFormatYMD }}</span>
              </template>
            </el-table-column>
            <el-table-column prop="log_user" label="操作人" />
          </el-table>
          <el-dialog
            title="费用明细"
            :visible.sync="dialogCaseLogFormVisible"
            :close-on-click-modal="false"
            :close-on-press-escape="false"
            :destroy-on-close="true"
            :append-to-body="true"
            @close="dialogCaseLogFormVisible=false"
          >
            <el-card class="box-card">
              <el-form :model="CaseLogForm">
                <el-form-item label="操作内容：">
                  <el-input v-model="CaseLogForm.log_content" type="textarea" resize="none" style="width: 80%" />
                </el-form-item>
                <el-form-item style="text-align: right;">
                  <el-button type="primary" @click="saveCaseLog">保存</el-button>
                </el-form-item>
              </el-form>
            </el-card>
          </el-dialog>
        </el-tab-pane>
        <el-tab-pane label="案件任务">
          <el-row style="text-align: left;padding: 5px 5px;">
            <el-button type="primary" size="mini" round @click="openCaseDialog(4)">新建</el-button>
          </el-row>
          <el-table :data="caseTaskTableData" height="250" style="width: 100%;">
            <el-table-column type="index" :index="computeTableIndex" label="序号" />
            <el-table-column prop="task_level" label="优先级">
              <template slot-scope="scope">
                <span>{{ scope.row.task_level | formatCaseTaskLevel }}</span>
              </template>
            </el-table-column>
            <el-table-column prop="task_title" label="标题" />
            <el-table-column prop="task_create_date" label="提交时间">
              <template slot-scope="scope">
                <span>{{ scope.row.task_create_date | formatSQLDateFormatYMD }}</span>
              </template>
            </el-table-column>
            <el-table-column prop="task_end_date" label="截止日期">
              <template slot-scope="scope">
                <span>{{ scope.row.task_end_date | formatSQLDateFormatYMD }}</span>
              </template>
            </el-table-column>
            <el-table-column prop="task_last_date" label="剩余时间">
              <template slot-scope="scope">
                <span>{{ Date.now() / 1000, scope.row.task_end_date | formatSQLDateDiff }}</span>
              </template>
            </el-table-column>
            <el-table-column prop="task_create_user" label="发起人" />
            <el-table-column prop="task_leader" label="负责人" />
            <el-table-column prop="task_status" label="状态">
              <template slot-scope="scope">
                <span>{{ scope.row.task_status | formatCaseTaskStatus }}</span>
              </template>
            </el-table-column>
            <el-table-column label="操作">
              <template slot-scope="scope">
                <a :href="VUE_APP_BASE_API + '?fileId=' + scope.row.file_id" target="_blank">
                  <span>查看</span>
                </a>
              </template>
            </el-table-column>
          </el-table>
        </el-tab-pane>
        <el-tab-pane label="客户任务">
          <el-row style="text-align: left;padding: 5px 5px;">
            <el-button type="primary" size="mini" round @click="openCaseDialog(5)">新建</el-button>
          </el-row>
          <el-table :data="customerTaskTableData" height="250" style="width: 100%;">
            <el-table-column type="index" :index="computeTableIndex" label="序号" />
            <el-table-column prop="task_level" label="优先级">
              <template slot-scope="scope">
                <span>{{ scope.row.task_level | formatCaseTaskLevel }}</span>
              </template>
            </el-table-column>
            <el-table-column prop="task_title" label="标题" />
            <el-table-column prop="task_create_date" label="提交时间">
              <template slot-scope="scope">
                <span>{{ scope.row.task_create_date | formatSQLDateFormatYMD }}</span>
              </template>
            </el-table-column>
            <el-table-column prop="task_end_date" label="截止日期">
              <template slot-scope="scope">
                <span>{{ scope.row.task_end_date | formatSQLDateFormatYMD }}</span>
              </template>
            </el-table-column>
            <el-table-column prop="task_last_date" label="剩余时间">
              <template slot-scope="scope">
                <span>{{ Date.now() / 1000, scope.row.task_end_date | formatSQLDateDiff }}</span>
              </template>
            </el-table-column>
            <el-table-column prop="task_create_user" label="发起人" />
            <el-table-column prop="task_leader" label="负责人" />
            <el-table-column prop="task_status" label="状态">
              <template slot-scope="scope">
                <span>{{ scope.row.task_status | formatCaseTaskStatus }}</span>
              </template>
            </el-table-column>
            <el-table-column label="操作">
              <template slot-scope="scope">
                <a :href="VUE_APP_BASE_API + '?fileId=' + scope.row.file_id" target="_blank">
                  <span>查看</span>
                </a>
              </template>
            </el-table-column>
          </el-table>
        </el-tab-pane>
        <el-dialog
          title="案件任务录入"
          :visible.sync="dialogCaseTaskFormVisible"
          :close-on-click-modal="false"
          :close-on-press-escape="false"
          :destroy-on-close="true"
          :append-to-body="true"
          @close="dialogCaseTaskFormVisible=false"
        >
          <el-card class="box-card">
            <el-form :model="CaseTaskForm">
              <el-form-item label="优先级：" prop="task_level">
                <el-select v-model="CaseTaskForm.task_level" filterable clearable placeholder="请选择">
                  <el-option value="1" label="重要">重要</el-option>
                  <el-option value="2" label="一般">一般</el-option>
                </el-select>
              </el-form-item>
              <el-form-item label="任务标题：">
                <el-input v-model="CaseTaskForm.task_title" style="width: 80%" />
              </el-form-item>
              <el-form-item label="截止时间：">
                <el-date-picker
                  v-model="CaseTaskForm.task_end_date"
                  type="date"
                  value-format="timestamp"
                  :picker-options="pickerOptions"
                  placeholder="选择日期"
                  style="width: 80%"
                />
              </el-form-item>
              <el-form-item style="text-align: right;">
                <el-button type="primary" @click="saveCaseTask">保存</el-button>
              </el-form-item>
            </el-form>
          </el-card>
        </el-dialog>
      </el-tabs>
    </div>
  </div>
</template>

<style>
fieldset {
  border: 1px solid #e6ebf5;
  margin: 10px 0 10px 0;
}

legend {
  font-size: 13px;
  padding: 0 10px 0 10px;
}

.el-date-editor.el-input, .el-date-editor.el-input__inner {
  width: 200px !important;
}

.el-input__inner {
  height: 30px;
  line-height: 30px;
}
.el-form-item__error {
  display: none;
}

.el-form-item {
  margin-bottom: 0;
}

</style>
<script>
import { customerSelect } from '@/api/customer'
import {
  CreateCaseTask,
  CaseTaskList,
  GetCaseTaskInfo,
  CaseSelectList,
  CreateCaseCost,
  CaseCostList,
  CreateCaseDoc,
  CaseDocList,
  CreateCaseLog,
  CaseLogList,
  CreateCase,
  CaseDetail
} from '@/api/case'
import store from '@/store'
import { formatDate } from '@/utils/date'
import { uploadFile } from '@/api/qiniu'

const const_option_case_cost_type = [
  { value: 10001, label: '差旅费' },
  { value: 10002, label: '一审诉讼费' },
  { value: 10003, label: '二审诉讼费' },
  { value: 10004, label: '三审诉讼费' },
  { value: 10005, label: '公证费' },
  { value: 10006, label: '调解金额' },
  { value: 10007, label: '判决金额' },
  { value: 10008, label: '保全费' },
  { value: 10009, label: '公告费' },
  { value: 10010, label: '担保费' },
  { value: 10011, label: '鉴定费' },
  { value: 10012, label: '执行费' },
  { value: 10013, label: '公证服务费' },
  { value: 10014, label: '律师代理费' },
  { value: 10015, label: '律师咨询费' },
  { value: 10016, label: '律师培训费' },
  { value: 10017, label: '律师见证费' },
  { value: 10018, label: '核定成本' },
  { value: 10019, label: '案源介绍费' },
  { value: 10020, label: '权利人分成' },
  { value: 10021, label: '投资人分成' },
  { value: 10022, label: '其他费用' }]
const option_case_task_level = [
  { value: 1, label: '重要' },
  { value: 2, label: '一般' }]
const defaultForm = {
  id: undefined,
  customer_id: 0, // 客户id
  customer_name: '', // 客户姓名
  case_name: '', // 案件名称
  case_code: '', // 案件编号
  case_type: '', // 案件类型
  case_step: '', // 案件阶段
  case_created_date: '', // 案件立案时间
  case_category: 2, // 案件种类(1-非诉讼案件，2-诉讼案件)
  case_publish_date: '', // 案件公告时间
  case_litigation_status: '', // 案件客户诉讼地位
  accusal_name: ''// 罪名
}
export default {
  name: 'LawsuitDetail',
  filters: {
    statusFilter(status) {
      const statusMap = {
        published: 'success',
        draft: 'info',
        deleted: 'danger'
      }
      return statusMap[status]
    },
    formatCaseCostType(cost_type) {
      return (const_option_case_cost_type.find((item) => item.value === cost_type) || { label: '' }).label
    },
    formatCaseTaskStatus(task_status) {
      const option_task_status = [{ value: 0, label: '已取消' }, { value: 1, label: '进行中' }, {
        value: 2,
        label: '已完成'
      }]
      return (option_task_status.find((item) => item.value === task_status) || { label: '' }).label
    },
    formatCaseTaskLevel(task_level) {
      return (option_case_task_level.find((item) => item.value === task_level) || { label: '' }).label
    },
    formatSQLDateFormatYMD(time) {
      const date = new Date(time * 1000)
      return formatDate(date, 'yyyy-MM-dd')
    },
    formatSQLDateDiff(time1, time2) {
      const iDays = parseInt((time2 - time1) / 60 / 60 / 24) // 把相差的毫秒数转换为天数
      return iDays + '天'
    }
  },
  props: {
    isEdit: {
      type: Boolean,
      default: false
    }
  },
  data() {
    return {
      loginType: store.getters.loginType,
      pickerOptions: {
        disabledDate(time) {
          return time.getTime() < Date.now()
        }
      },
      case_id: 0,
      lawsuit_form: Object.assign({}, defaultForm),
      loading: false,
      timeNow: new Date(),
      customer_options: [],
      option_case_litigation_status: [
        { value: 21, label: '被告人/犯罪嫌疑人' },
        { value: 22, label: '被害人' }],
      option_case_type: [
        { value: 2, label: '国内实用新型专利' },
        { value: 3, label: '国内外观设计专利' },
        { value: 4, label: '国内商标' },
        { value: 5, label: '国内软件著作权' },
        { value: 6, label: '马德里商标注册' },
        { value: 7, label: '指定国商标注册' },
        { value: 8, label: '国内作品著作权' },
        { value: 9, label: '上海市高新技术成果转化认定' },
        { value: 10, label: '上海市创新基金申报' },
        { value: 11, label: '其他科技项目' },
        { value: 12, label: '法律' },
        { value: 13, label: '其他' },
        { value: 14, label: 'PCT国际阶段' },
        { value: 15, label: 'PCT发明进入中国' },
        { value: 16, label: 'PCT发明进入中国' },
        { value: 17, label: '外观设计进入中国' },
        { value: 18, label: '指定国发明专利' },
        { value: 19, label: '指定国实用新型专利' },
        { value: 20, label: '指定国外观设计专利' },
        { value: 21, label: '国内集成电路步图设计' },
        { value: 22, label: '高新技术企业认定' }],
      option_case_step: [
        { value: 1, label: '等待公证书' },
        { value: 2, label: '审核公证书' },
        { value: 3, label: '新案待分配' },
        { value: 4, label: '文书准备' },
        { value: 5, label: '等待立案' },
        { value: 6, label: '补充取证' },
        { value: 10, label: '提交立案' },
        { value: 13, label: '一审立案受理' },
        { value: 14, label: '一审补充证据' },
        { value: 15, label: '一审准备开庭' },
        { value: 16, label: '一审再次开庭' },
        { value: 17, label: '一审庭后待判' },
        { value: 20, label: '一审等待上诉' },
        { value: 21, label: '一审待执行' },
        { value: 22, label: '一审上诉准备' },
        { value: 23, label: '一审补充代理意见' },
        { value: 24, label: '一审和解中' },
        { value: 25, label: '一审和解结案' },
        { value: 26, label: '二审立案受理' },
        { value: 27, label: '二审补充证据' },
        { value: 28, label: '二审通知开庭' },
        { value: 31, label: '二审再次开庭' },
        { value: 32, label: '二审庭后待判' },
        { value: 33, label: '二审待执行' },
        { value: 38, label: '二审补充代理意见' },
        { value: 39, label: '二审和解中' },
        { value: 41, label: '二审和解结案' },
        { value: 42, label: '再审立案受理' },
        { value: 44, label: '再审补充证据' },
        { value: 45, label: '再审通知开庭' },
        { value: 46, label: '再审庭后待判' },
        { value: 47, label: '再审待执行' },
        { value: 48, label: '再审和解中' },
        { value: 49, label: '再审和解结案' },
        { value: 50, label: '执行立案' },
        { value: 51, label: '执行受理' },
        { value: 52, label: '执行中止' },
        { value: 53, label: '执行结案' },
        { value: 99, label: '执行终本' },
        { value: 100, label: '案件作废' }
      ],
      option_case_accusal_name: [],
      VUE_APP_BASE_API: 'https://view.officeapps.live.com/op/view.aspx?src=' + process.env.VUE_APP_BASE_API + '/wzj/file/get',
      lawsuitFormRules: {
        customer_name: [
          { required: true, message: '请选择客户信息', trigger: 'change' }
        ],
        case_litigation_status: [
          { required: true, message: '客户诉讼地位不能为空', trigger: 'blur' }
        ],
        accusal_name: [
          { required: true, message: '罪名不能为空', trigger: 'blur' }
        ],
        case_name: [
          { required: true, message: '案件名称不能为空', trigger: 'blur' }
        ],
        case_type: [
          { required: true, message: '案件类型不能为空', trigger: 'change' }
        ],
        case_step: [
          { required: true, message: '案件阶段不能为空', trigger: 'change' }
        ],
        case_created_date: [
          { required: true, message: '案件立案时间不能为空', trigger: 'blur' }
        ],
        case_publish_date: [
          { required: true, message: '初审公告时间不能为空', trigger: 'blur' }
        ]
      },
      docTableData: [],
      docList: [],
      dialogCaseDocFormVisible: false,
      option_case_cost_type: const_option_case_cost_type,
      costTableData: [],
      dialogCaseCostFormVisible: false,
      CaseCostForm: {},
      caseLogTableData: [],
      dialogCaseLogFormVisible: false,
      CaseLogForm: {},
      caseTaskTableData: [],
      dialogCaseTaskFormVisible: false,
      customerTaskTableData: [],
      CaseTaskForm: {}
    }
  },
  created() {
    this.getCustomerSelect()
    this.getSelectList()
    if (this.isEdit) {
      const caseId = this.$route.params && this.$route.params.caseId
      this.fetchData(caseId)
    }
    this.tempRoute = Object.assign({}, this.$route)
  },
  methods: {
    computeTableIndex(index) {
      return index + 1
    },
    setCustomerId(value) {
      this.lawsuit_form.customer_id = parseInt(value) || 0
    },
    getCustomerSelect() {
      const that = this
      customerSelect().then(res => {
        that.customer_options = res.data
      })
    },
    getSelectList() {
      const that = this
      CaseSelectList('case_accusal').then(res => {
        that.option_case_accusal_name = res.data
      })
    },
    fetchData(caseId) {
      CaseDetail(caseId).then(response => {
        this.lawsuit_form = response.data
        this.setTagsViewTitle()
        this.case_id = caseId
        this.getCaseDocList()
      }).catch(err => {
        console.log(err)
      })
    },
    setTagsViewTitle() {
      const title = '编辑刑事案件'
      const route = Object.assign({}, this.tempRoute, { title: `${title}` })
      this.$store.dispatch('tagsView/updateVisitedView', route)
      document.title = `${title}`
    },
    submitCustomerForm(formName) {
      let message = '案件创建成功'
      if (this.isEdit) {
        message = '案件更新成功'
      }
      this.loading = true
      CreateCase(this.lawsuit_form).then(res => {
        this.loading = false
        this.$notify({
          title: '成功',
          message: message,
          type: 'success',
          duration: 2000
        })
        if (!this.isEdit) {
          this.lawsuit_form = {}
        }
        this.loading = false
      })
    },
    tabsHandleClick(tab, event) {
      if (tab.label === '文档信息') {
        this.getCaseDocList()
      } else if (tab.label === '费用明细') {
        this.getCaseCostList()
      } else if (tab.label === '系统日志') {
        this.getCaseLogList()
      } else if (tab.label === '案件任务') {
        this.getCaseTaskList()
      } else if (tab.label === '客户任务') {
        this.getCaseCustomerTaskList()
      }
    },
    getCaseDocList() {
      const that = this
      const dataParam = {
        case_id: parseInt(that.case_id)
      }
      CaseDocList(dataParam).then(response => {
        that.docTableData = response.data
      }).catch(() => {
        that.docTableData = []
      })
    },
    getCaseCostList() {
      const that = this
      const dataParam = {
        case_id: parseInt(that.case_id)
      }
      CaseCostList(dataParam).then(response => {
        that.costTableData = response.data
      }).catch(() => {
        that.costTableData = []
      })
    },
    getCaseLogList() {
      const that = this
      const dataParam = {
        case_id: parseInt(that.case_id)
      }
      CaseLogList(dataParam).then(response => {
        that.caseLogTableData = response.data
      }).catch(() => {
        that.caseLogTableData = []
      })
    },
    getCaseTaskList() {
      const that = this
      const dataParam = {
        case_id: parseInt(that.case_id),
        task_type: 1
      }
      CaseTaskList(dataParam).then(response => {
        that.caseTaskTableData = response.data
      }).catch(() => {
        that.caseTaskTableData = []
      })
    },
    getCaseCustomerTaskList() {
      const that = this
      const dataParam = {
        case_id: parseInt(that.case_id),
        task_type: 2
      }
      CaseTaskList(dataParam).then(response => {
        that.customerTaskTableData = response.data
      }).catch(() => {
        that.customerTaskTableData = []
      })
    },
    openCaseDialog(action_type) {
      if (action_type === 1) {
        this.dialogCaseDocFormVisible = true
        return
      }
      if (action_type === 2) {
        this.dialogCaseCostFormVisible = true
        this.CaseCostForm = {}
        return
      }
      if (action_type === 3) {
        this.dialogCaseLogFormVisible = true
        return
      }
      if (action_type === 4) {
        this.dialogCaseTaskFormVisible = true
        this.CaseTaskForm.task_type = 1
        return
      }
      if (action_type === 5) {
        this.dialogCaseTaskFormVisible = true
        this.CaseTaskForm.task_type = 2
        return
      }
    },
    submitUpload() {
      this.$refs.upload.submit()
    },
    uploadImg(fileObj) {
      const that = this
      const formData = new FormData()
      formData.set('file', fileObj.file)
      this.loading = true
      uploadFile(formData, {
        headers: {
          'Content-type': 'multipart/form-data'
        }
      }).then(res => {
        const dataParam = {
          case_id: parseInt(this.case_id),
          file_id: parseInt(res.data),
          doc_name: fileObj.file.name.substring(0, fileObj.file.name.lastIndexOf('.'))
        }
        CreateCaseDoc(dataParam).then(res => {
          that.loading = false
          that.$notify({
            title: '成功',
            message: res.message || '更新成功',
            type: 'success',
            duration: 2000
          })
          that.getCaseDocList()
        })
        that.dialogCaseDocFormVisible = false
      }
      ).catch(err => {
        that.loading = false
        console.log(err)
      })
    },
    saveCaseCost() {
      const dataParam = {
        case_id: parseInt(this.case_id),
        cost_type: this.CaseCostForm.cost_type,
        cost_amount: this.CaseCostForm.cost_amount,
        cost_remark: this.CaseCostForm.cost_remark
      }
      CreateCaseCost(dataParam).then(res => {
        this.loading = false
        this.$notify({
          title: '成功',
          message: res.message || '更新成功',
          type: 'success',
          duration: 2000
        })
        this.getCaseCostList()
        this.dialogCaseCostFormVisible = true
      })
    },
    saveCaseLog() {
      const dataParam = {
        case_id: parseInt(this.case_id),
        log_content: this.CaseLogForm.log_content
      }
      CreateCaseLog(dataParam).then(res => {
        this.loading = false
        this.$notify({
          title: '成功',
          message: res.message || '更新成功',
          type: 'success',
          duration: 2000
        })
        this.getCaseLogList()
        this.dialogCaseLogFormVisible = true
      })
    },
    saveCaseTask() {
      const dataParam = {
        case_id: parseInt(this.case_id),
        task_type: this.CaseTaskForm.task_type,
        task_level: parseInt(this.CaseTaskForm.task_level),
        task_title: this.CaseTaskForm.task_title,
        task_status: 1,
        task_end_date: this.CaseTaskForm.task_end_date / 1000
      }
      console.log(dataParam)
      const that = this
      CreateCaseTask(dataParam).then(res => {
        that.loading = false
        that.$notify({
          title: '成功',
          message: res.message || '更新成功',
          type: 'success',
          duration: 2000
        })
        if (dataParam.task_type === 1) {
          that.getCaseTaskList()
        } else {
          that.getCaseCustomerTaskList()
        }
        that.CaseTaskForm = {}
        that.dialogCaseTaskFormVisible = true
      })
    }
  }
}
</script>
